<template>
  <view class="template-login">
	  <shouye v-if="loginType == 1 && tabberPageLoadFlag[0]" :style="{display: currentIndex === 0 ? '' : 'none'}" ref="shouye"></shouye>
	  <jiazhangindex v-if="loginType == 2 && tabberPageLoadFlag[0]" :style="{display: currentIndex === 0 ? '' : 'none'}" ref="jiazhangshouye" @goxiangce="goxiangce"></jiazhangindex>
	  <banjidongtai v-if="tabberPageLoadFlag[1]" :style="{display: currentIndex === 1 ? '' : 'none'}" ref="banjidongtai"></banjidongtai>
	  <!-- <kecheng v-if="tabberPageLoadFlag[2]" :style="{display: currentIndex === 2 ? '' : 'none'}" ref="kecheng"></kecheng> -->
	  <baobaoxiangce v-if="tabberPageLoadFlag[2]" :style="{display: currentIndex === 2 ? '' : 'none'}" ref="bbxiangce"></baobaoxiangce>
	  <my v-if="tabberPageLoadFlag[3]" :style="{display: currentIndex === 3 ? '' : 'none'}" ref="my"></my>
	  <tn-tabbar
	    v-model="currentIndex"
	    :list="tabbarList"
	    activeColor="#9DD757"
	    inactiveColor="#BBBBBB"
	    activeIconColor="tn-cool-bg-color-7"
	    :animation="true"
	    :safeAreaInsetBottom="true"
	    @change="switchTabbar"
	  ></tn-tabbar>
  </view>
</template>

<script>
	import shouye from '../shouye/index.vue'
	import banjidongtai from '../banjidongtai/index.vue'
	import kecheng from '../kecheng/index.vue'
	import my from '../my/index.vue'
	import jiazhangindex from '../shouye/jiazhangindex.vue'
	import baobaoxiangce from './baobaoxiangce.vue'
  export default {
    name: 'child-index',
	components:{shouye, banjidongtai, my, jiazhangindex, baobaoxiangce },
    data() {
      return {
		  tabbarList: [
		    {
		      title: '首页',
		      activeIcon: '/static/tabbar/home_ac.png',
		      inactiveIcon: '/static/tabbar/home.png'
		    },
		    {
		      title: '班级动态',
		      activeIcon: '/static/tabbar/dynamic_ac.png',
		      inactiveIcon: '/static/tabbar/dynamic.png',
		    },
		    {
		      title: '相册',
		      activeIcon: '/static/tabbar/photo_ac.png',
		      inactiveIcon: '/static/tabbar/photo.png'
		    },
		    {
		      title: '我的',
		      activeIcon: '/static/tabbar/my_ac.png',
		      inactiveIcon: '/static/tabbar/my.png',
		    }
		  ],
			// tabbar当前被选中的序号
			currentIndex: 0,
			// 自定义底栏对应页面的加载情况
			tabberPageLoadFlag: [],
			loginType: 2,
			
      }
    },
    onLoad(options) {
	  this.loginType = uni.getStorageSync('loginType');
	  console.log('this.loginType ======== ', this.loginType)
	  let token = uni.getStorageSync('token');
	  console.log('this.token ======== ', token)
	  if(!token || !this.loginType){
		  uni.reLaunch({
		  	url: '/pages/login/index'
		  })
	  }
      const index = Number(options.index || 0)
      // 根据底部tabbar菜单列表设置对应页面的加载情况
      this.tabberPageLoadFlag = this.tabbarList.map((item, tabbar_index) => {
        return index === tabbar_index
      })
      this.switchTabbar(index)
	  this.getWXCode()
    },
	onShow: function () {
		setTimeout(() => {
			if(document && document.getElementsByClassName('uni-page-head-hd')){
				var a = document.getElementsByClassName('uni-page-head-hd')[0];
				if(a){
					a.style.display = 'none';
				}
			}
		}, 0)
		if(this.currentIndex == 1 || this.currentIndex == 2){
			uni.startPullDownRefresh()
		}else if(this.currentIndex == 3){
			this.$refs.my.setDatas();
			this.$refs.my.getList();
		}
	},
	mounted() {
		
	},
		onPullDownRefresh() {
			// if(this.loginType == 1){
				if(this.currentIndex === 0){
					if(this.loginType == 1){
						this.$refs.shouye.getMsgList();
						uni.stopPullDownRefresh()
					}else{
						uni.stopPullDownRefresh()
					}
				}else if(this.currentIndex === 1){
					console.log('-----huoqu动态----')
					this.$refs.banjidongtai.pageIndex = 1;
					this.$refs.banjidongtai.getdongtai();
				}else if(this.currentIndex === 2){
					this.$refs.bbxiangce.pageIndex = 1;
					this.$refs.bbxiangce.getrenwulist();
					
				}else if(this.currentIndex === 3){
					uni.stopPullDownRefresh()
				}
			// }else if(this.loginType == 2){
				
			// }
			console.log('下拉刷新------')
		},
		onReachBottom() {
			console.log('上啦更多-------')
			// if(this.loginType == 1){
				if(this.currentIndex === 0){
					uni.stopPullDownRefresh();
				}else if(this.currentIndex === 1){
					console.log('-----huoqu动态----')
					this.$refs.banjidongtai.pageIndex++;
					this.$refs.banjidongtai.getdongtai();
				}else if(this.currentIndex === 2){
					this.$refs.bbxiangce.pageIndex++;
					this.$refs.bbxiangce.getrenwulist();
					
				}else if(this.currentIndex === 3){
					uni.stopPullDownRefresh()
				}
			// }else if(this.loginType == 2){
				
			// }
		},
    methods: {
		getWXCode(){
				  console.log('uni.getSystemInfoSync == ',uni.getSystemInfoSync())
				  if (uni.getSystemInfoSync().uniPlatform !== 'mp-weixin') {
					return;
				  }
				  var that=this;
				      wx.login({
				        success: function (res) {
							console.log(' wx.login ---------- ', res)
				          var code = res.code;//发送给服务器的code
				          
						  if (code) {
						  						that.request({
						  							url: '/Account/GetWechatInfo',
						  							method: 'get',
						  							params: {
						  								code: code,
						  							},
						  						}).then(respd => {
						  							if(respd.code == 200){
						  								let jsData = JSON.parse(respd.data)
						  								console.log('获取到的用户openid为：' + jsData.openid);
														uni.setStorageSync('openid', jsData.openid);
						  							}
						  						})
						  }
						  else {
						    console.log("获取用户登录态失败！");
						  }
				        },
				        fail: function (error) {
				          console.log('login failed ' + error);
				        }
				      }) 
			  },
      // 切换导航
      switchTabbar(index) {
        this._switchTabbarPage(index)
		if(this.currentIndex == 3 && this.$refs.my){
			this.$refs.my.getList();
		}
      },
      goxiangce(){
		  this.switchTabbar(2)
	  },
      
      // 导航页面滚动到底部
      tabbarPageScrollLower(e) {
      },
      
      // 切换导航页面
      _switchTabbarPage(index) {
        const selectPageFlag = this.tabberPageLoadFlag[index]
        if (selectPageFlag === undefined) {
          return
        }
        if (selectPageFlag === false) {
          this.tabberPageLoadFlag[index] = true
        }
		if(index == 0){
			uni.setNavigationBarTitle({
				title: ''
			})
		}else{
			uni.setNavigationBarTitle({
				title: this.tabbarList[index].title
			})
		}
		
        this.currentIndex = index;
		if(this.loginType == 2 && index == 0){
			this.$nextTick(()=>{
				this.$refs.jiazhangshouye.getXiangce();
			})
		}
		if(index == 2){
			this.$nextTick(()=>{
				this.$refs.bbxiangce.queryFunction();
			})
		}
      }
    }
  }
</script>

<style lang="scss" scoped>
  @import '@/static/css/templatePage/custom_nav_bar.scss';
  /* 悬浮 */
  .rocket-sussuspension{
    animation: suspension 3s ease-in-out infinite;
  }
  
  @keyframes suspension {
    0%, 100% {
      transform: translate(0 , 0);
    }
    50% {
      transform: translate(-0.8rem , 1rem);
    }
  }
  
  .login {
    position: relative;
    height: 100%;
    z-index: 1;
    
    /* 背景图片 start */
    &__bg {
      z-index: -1;
      position: fixed;
      
      &--top {
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        
        .bg {
          width: 750rpx;
          will-change: transform;
        }
        .rocket {
          margin: 50rpx 28%;
          width: 400rpx;
          will-change: transform;
        }
      }
      
      &--bottom {
        bottom: -10rpx;
        left: 0;
        right: 0;
        width: 100%;
        // height: 144px;
        margin-bottom: env(safe-area-inset-bottom);
        
        image {
          width: 750rpx;
          will-change: transform;
        }
      }
    }
    /* 背景图片 end */
    
    /* 内容 start */
    &__wrapper {
      margin-top: 403rpx;
      width: 100%;
    }
    
    /* 切换 start */
    &__mode {
      position: relative;
      margin: 0 auto;
      width: 476rpx;
      height: 77rpx;
      background-color: #FFFFFF;
      box-shadow: 0rpx 10rpx 50rpx 0rpx rgba(0, 3, 72, 0.1);
      border-radius: 39rpx;
      
      &__item {
        height: 77rpx;
        width: 100%;
        line-height: 77rpx;
        text-align: center;
        font-size: 31rpx;
        color: #908f8f;
        letter-spacing: 1em;
        text-indent: 1em;
        z-index: 2;
        transition: all 0.4s;
        
        &--active {
          font-weight: bold;
          color: #FFFFFF;
        }
      }
      
      &__slider {
        position: absolute;
        height: inherit;
        width: calc(476rpx / 2);
        border-radius: inherit;
        box-shadow: 0rpx 18rpx 72rpx 18rpx rgba(0, 195, 255, 0.1);
        z-index: 1;
        transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      }
    }
    /* 切换 end */
    
    /* 登录注册信息 start */
    &__info {
      margin: 0 30rpx;
      margin-top: 105rpx;
      padding: 30rpx 51rpx;
      padding-bottom: 0;
      border-radius: 20rpx;
      background-color: #ffff;
      box-shadow: 0rpx 10rpx 50rpx 0rpx rgba(0, 3, 72, 0.1);
      
      &__item {
        
        &__input {
          margin-top: 59rpx;
          width: 100%;
          height: 77rpx;
          border: 1rpx solid #E6E6E6;
          border-radius: 39rpx;
          
          &__left-icon {
            width: 10%;
            font-size: 44rpx;
            margin-left: 20rpx;
            color: #AAAAAA;
          }
          
          &__content {
            width: 80%;
            padding-left: 10rpx;
            
            &--verify-code {
              width: 56%;
            }
            
            input {
              font-size: 24rpx;
              // letter-spacing: 0.1em;
            }
          }
          
          &__right-icon {
            width: 10%;
            font-size: 44rpx;
            margin-right: 20rpx;
            color: #AAAAAA;
          }
          
          &__right-verify-code {
            width: 34%;
            margin-right: 20rpx;
          }
        }
        
        &__button {
          margin-top: 75rpx;
          margin-bottom: 39rpx;
          width: 100%;
          height: 77rpx;
          text-align: center;
          font-size: 31rpx;
          font-weight: bold;
          line-height: 77rpx;
          letter-spacing: 1em;
          text-indent: 1em;
          border-radius: 39rpx;
          box-shadow: 1rpx 10rpx 24rpx 0rpx rgba(60, 129, 254, 0.35);
        }
        
        &__tips {
          margin: 30rpx 0;
          color: #AAAAAA;
        }
      }
    }
    /* 登录注册信息 end */
    
    /* 登录方式切换 start */
    &__way {
      margin: 0 auto;
      margin-top: 110rpx;
      
      &__item {
        &--icon {
          width: 77rpx;
          height: 77rpx;
          font-size: 50rpx;
          border-radius: 100rpx;
          margin-bottom: 18rpx;
          position: relative;
          z-index: 1;
          
          &::after {
            content: " ";
            position: absolute;
            z-index: -1;
            width: 100%;
            height: 100%;
            left: 0;
            bottom: 0;
            border-radius: inherit;
            opacity: 1;
            transform: scale(1, 1);
            background-size: 100% 100%;
            background-image: url(https://tnuiimage.tnkjapp.com/cool_bg_image/icon_bg5.png);
          }
        }
      }
    }
    /* 登录方式切换 end */
    /* 内容 end */
    
  }
  
  /deep/.input-placeholder {
    font-size: 24rpx;
    color: #E6E6E6;
  }
  
</style>
